<template>
  <div class="result">
    <div style="display:flex;justify-content:center;margin-top:15px">
        <div class="tag"></div>
        <div class="title">大师解梦</div>
        <div class="tag"></div>
    </div>
    <div v-for="item in results" :key="item.id">
       <div class="item-title">
        <div class="tag"></div>
        <div class="title">{{item.title}}</div>
     </div>
     <div class="content">{{item.des}}</div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'searchResult',
  props: {
    results: {
      type: Array,
      require: true
    }
  }
}
</script>

<style lang="less" scoped>
    .result{
        background-color: white;
        padding: 15px;
          .tag{
                width: 30px;
                height: 100px;
                border-color: #ffd000;
                background-color: #ffd000;
                margin-right: 18px;
            }
            .title{
                font-size: 70px;
                font-weight: bold;
            }
        div{
            line-height: 100px;
        }
        .item-title{
            padding-left:15px;
            display: flex;
            justify-content: flex-start;
        }
        .content{
                font-size: 70px;
                text-align: left;
        }
    }
</style>
